<template>
    <div class="collectvideo">
        <div class="collectvideo-head">
        <router-link to="/user"> 
            <div class="img_0">
                <img src="../../images/icon_bangding_01.png" alt="">
            </div>
        </router-link> 
                <h2>{{msg}}</h2>            
        </div>
        
        <div class="nav">
            <router-link to="collectgambit">
                <div class="nav_left">话题</div>
            </router-link>
            <router-link to="collectproduct">
                <div class="nav_center">产品</div>
            </router-link>
            <router-link to="collectvideo">
                <div class="nav_right">视频</div>
            </router-link>
        </div>
        <div class="content">
            <div class="icon">
                <div class="icon_img">
                    <img src="../../images/IMG_shoucangyehuati_bg5.png" alt="">
                    <h2>Lucy</h2>
                </div>
                <div class="number">
                    <h2>2016年11月20日</h2>
                </div>
            </div>
            <div class="img">
                <img src="../../images/IMG_bianmeixue_01.png" 
                alt="">
                <div class="img_2">
                    <img src="../../images/icon_shipingbofang_1.png" alt="">
                </div>
            </div>
        </div>
                <div class="content">
            <div class="icon">
                <div class="icon_img">
                    <img src="../../images/IMG_shoucangyehuati_bg5.png" alt="">
                    <h2>Lucy</h2>
                </div>
                <div class="number">
                    <h2>2016年11月20日</h2>
                </div>
            </div>
            <div class="img">
                <img src="../../images/IMG_shoucangyehuati_bg1.png" 
                alt="">
                <div class="img_2">
                    <img src="../../images/icon_shipingbofang_1.png" alt="">
                </div>
            </div>
            
        </div>
     <div class="footer">到底啦~</div>

         
    </div>
</template>
<script>
    export default{
        name:'collectgambit',
        data(){
            return{
                msg:'收藏'
            }
        }       
    }
</script>

<style lang='less' scoped>
.collectvideo-head{
    height:80/75rem;
    background:#FF406F;
    margin-bottom:33/75rem;
}
.collectvideo-head h2{
    float:right;
    font-size:36/75rem;
    line-height:80/75rem;
    color:#fff;
    margin-right:340/75rem;
}
.collectvideo-head .img_0{
    float:left;
    height:36/75rem;
}
.collectvideo-head .img_0 img{
    float:left;
    margin-left:20/75rem;    
    margin-top:26/75rem;
}
.nav{
    width:650/75rem;
    height:36/75rem;
    margin:0 auto;
    font-size:26/75rem;
    text-align:center;
    line-height:36/75rem;
    margin-bottom:30/75rem;
}
.nav_left{
    width:215/75rem;
    height:36/75rem;
    float:left;
    border-right:1px solid #808080;
}
.nav_center{
    width:215 /75rem;
    height:36/75rem;
    float:left;
    border-left:1px solid #808080;
    border-right:1px solid #808080;

}
.nav_right{
    width:213/75rem;
    height:36/75rem;
    float:left;
    border-left:1px solid #808080;
}
.content{
    width:710/75rem;
    height:420/75rem;
    background:#FFF;
    margin:0 auto;
    border-radius:10/75rem;
    text-align:center;
}
.footer{
    width:750/75rem;
    text-align:center;
    font-size:24/75rem;
    margin-top:40/75rem;

}
.icon{
    height:46/75rem;
    width:710/75rem;
    margin:0 auto;
    font-size:24/75rem;
    color:#8C8C8C;
}
.icon_img img{
    float:left;
    width:46/75rem;
    height:46/75rem;
    margin-top:13/75rem;
    border-radius:10/75rem;
    margin-left:18/75rem;
    
}
.icon_img h2{
    float:left;
    margin-top:26/75rem;
    margin-left:18/75rem;
}
.number{
    float:right;
}
.number h2{
    float:left;
    margin-top:28/75rem;
    margin-right:24/75rem;
}
.img{
    margin-top:25/75rem;
    position: relative;
}
.img img{
    width:669/75rem;
    height:320/75rem;
}
.img_2{
    position: absolute;
    top:92/75rem;
    left:294/75rem;
}
.img_2 img{
    width:128/75rem;
    height:128/75rem;
}
</style> 

